const path = require('path');
const HtmlPlugin = require('html-webpack-plugin');
const { CleanWebpackPlugin } = require("clean-webpack-plugin");

module.exports = {
    entry: './src/index.js',
    output: {
        filename: 'main.js',
        path: path.resolve(__dirname, 'dist')
    },
    plugins:[
        new CleanWebpackPlugin(),
        new HtmlPlugin({
            title: 'webpack output'
        })
    ],
    module:{
        rules:[
            {
                test: /\.css$/,
                use: ["style-loader", "css-loader"]
            },
            {
                test: /\.(png|svg|jpg|gif)$/,
                use:['file-loader']
            },
            {
                test: /\.(woff|woff2|eot|ttf|otf)$/,
                use: ["file-loader"],
            },
            {
                test: /\.(csv|tsv)$/,
                use: ["csv-loader"],
            },
            {
              test: /\.xml$/,
              use: ["xml-loader"],
            },
            {
                test: /\.txt$/,
                use: "raw-loader",
            },
        ]
    },
    devServer:{
        contentBase: './dist',
        host: 'localhost',
        port: 8000,
        open: true,
        hot: true,
        hotOnly: true
    }
}